<template lang="pug">
  .audiWrapper
    alert(type="warning")
      |  备课审核是指上课老师在备课以后, 需要审核者确认一次备课的内容. 如果需要此功能请在下面开启.
    el-row(:gutter="16" v-loading="loading")
      el-col(:span="12" v-for="(item, key) in auditSettingArr" :key="key")
        el-card(:header="item.title" class="auditForm")
          form-box(
            size="mini"
            :showCancel="false"
            :ref="`auditForm-${key}`"
            :fields="auditFields"
            :baseData="{ ...info, formKey: key }"
            :submit-handle="val => submitHandle(val, item.category)"
            :submitting="submitting"
          )
</template>
<script>
import { mapGetters } from 'vuex'
import Alert from '@/components/Basic/Alert'
import { auditConfig, auditSettingArr } from './config'
import { getAuditConfig, auditSubmit } from './api'

export default {
  components: {
    Alert
  },
  data () {
    return {
      info: {},
      auditFields: auditConfig,
      auditSettingArr,
      loading: false,
      submitting: false
    }
  },
  computed: {
    ...mapGetters(['curArea'])
  },
  created () {
    this.getConfig()
  },
  methods: {
    getConfig () {
      const { curArea } = this
      this.loading = true
      getAuditConfig({ areaId: curArea.areaId }).then(res => {
        this.info = res
      }).finally(() => {
        this.loading = false
      })
    },
    submitHandle (values, category) {
      const { curArea } = this
      this.submitting = false
      auditSubmit(
        { areaId: curArea.areaId },
        {
          ...values,
          category,
          isOpen: values.isOpen ? 0 : 1
        }
      ).then(res => {
        if (res) {
          this.$message.success('保存成功')
        }
      }).finally(() => {
        this.submitting = true
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.auditForm{
  margin-top: 16px
}
</style>
